.zhufeng-container {
	/* 
	 * 需要用户后期自己配置的样式
	 *   width
	 *   height
	 */
	position: relative;
	box-sizing: border-box;
	width: 100%;
	overflow: hidden;
}

.zhufeng-container .zhufeng-wrapper {
	/* 
	 * 需要在JS中动态计算的样式
	 *   width 根据SLIDE的个数（含克隆的）* CONTAINER容器的宽度
	 *   transition 是在JS中设置的
	 *   left 初始展示哪一个SLIDE，LEFT值就应该是计算好的
	 */
	display: flex;
	box-sizing: border-box;
	position: absolute;
	top: 0;
	height: 100%;
}

.zhufeng-container .zhufeng-wrapper .zhufeng-slide {
	/*
	 * 需要用户后期自己配置的样式
	 *   width 和CONTAINER的宽度保持一致（JS中处理）
	 */
	box-sizing: border-box;
	height: 100%;
	overflow: hidden;
}

.zhufeng-container .zhufeng-wrapper .zhufeng-slide img {
	display: block;
	width: 100%;
	height: 100%;
}

.zhufeng-container .zhufeng-pagination {
	position: absolute;
	bottom: 10px;
	left: 50%;
	z-index: 999;
	transform: translateX(-50%);
	padding: 3px 6px;
	background: rgba(255, 255, 255, .3);
	font-size: 0;
	border-radius: 10px;
}

.zhufeng-container .zhufeng-pagination span {
	display: inline-block;
	margin: 0 6px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: lightblue;
	cursor: pointer;
}

.zhufeng-container .zhufeng-pagination span.active {
	background: lightcoral;
}

.zhufeng-arrow-prev,
.zhufeng-arrow-next {
	display: none;
	position: absolute;
	z-index: 999;
	top: 50%;
	margin-top: -22.5px;
	width: 30px;
	height: 45px;
	/* 插件中的样式资源最好不要使用图片（因为这样需要用户额外的导入，不利于插件的推广和使用） => 需要使用图片，我们最好把图片设置为BASE64编码 */
	background: url("") no-repeat 0 0;
}

.zhufeng-arrow-prev {
	left: 0;
}

.zhufeng-arrow-next {
	right: 0;
	background-position: -50px 0;
}

.zhufeng-container:hover .zhufeng-arrow-prev,
.zhufeng-container:hover .zhufeng-arrow-next {
	display: block;
}